<template>
  <div class="mg-top">
    <van-cell-group inset>
      <van-field
        label="新密码"
        v-model="state.oldPassword"
        required
        placeholder="请输入新密码"
      />
      <van-field
        label="确认新密码"
        v-model="state.newPassword"
        required
        placeholder="请再次输入新密码"
      />
      <div class="mg-top">
        <van-button type="primary" round size="large" @click="onUpdatePassword">
          确定
        </van-button>
      </div>
    </van-cell-group>
    <BackEvent @handlepaly="handlepaly"></BackEvent>
  </div>
</template>
<script setup>
import { reactive } from "vue";
import api from "@/api/login.js";
import { showDialog } from "vant";
import { useRouter } from "vue-router";

const router = useRouter();
const state = reactive({
  oldPassword: "",
  newPassword: "",
});

async function onUpdatePassword() {
  const res = await api.updatePassword(state);
  if (res.code === 0) {
    showDialog({
      title: "修改密码成功！",
      message: "你的新密码：" + state.newPassword,
      confirmButtonText: "去登陆",
      cancelButtonText: "取消",
    }).then(() => {
      router.push({
        path: "/login",
      });
    });
  }
}
</script>
